<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>{$seo_title}</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no" />
		<meta name="format-detection" content="email=no" />
		<meta name="keywords" content="{$seo_keywords}" />
		<meta name="description" content="{$seo_description}">
	    <meta name="screen-orientation" content="portrait">
	    <meta name="x5-orientation" content="portrait">

		<script src="__STATIC__mobile/js/jquery.js"></script>
		<script src="__STATIC__mobile/js/layer.mobile-v1.6/layer.m.js"></script>
		<script src="__STATIC__mobile/js/common.js"></script>
		

    <link href="__STATIC__mobile/css/pengyouquan.css" rel="stylesheet" type="text/css">

		<!-- 微信分享 -->
		<include file="Common:wechatshare" />
	</head>
<body>

       <script>
       
       $(function(){
    	   
    	   old_selectid = 0;//上一个选中的id
    	   now_selectid = 0;//当前选中的id
    	   
	   		//浏览图片
	   		$('#main').on('click','.preview', function(){
	   			var now_pic = $(this).attr("data-src");
	   			var pics = new Array();
	   			$(this).parent().find('.preview').each(function(index) {
	   				pics.push($(this).attr("data-src"));
	   			 });
	   			//console.log(now_pic);
	   			//console.log(pics);
	   			previewImage(now_pic,pics);
	   		});
	   		
    	   //点击空白处关闭按钮
	   		$('#main').on('touchstart','.emptybtn', function(){
	   			$(".zanbtn").hide();
	   		});
	   		
	   		
	   		//点赞按钮
	   		$('#main').on('click','.c-icon', function(){
	   			//判断当前是否已经展开
				var top = $(this).offset().top;//顶部距离
				old_selectid = now_selectid;//获取之前选中的id
				now_selectid = $(this).attr("selectid");//当前选中的id
				
				var status = $(this).attr("status");//1已经点赞,开启支付    0未点赞,开启支付   2已经点赞,关闭支付    3.未点赞,关闭支付
				if(status == 1){
  						//1已经点赞,开启支付 
  						$(".zanbtn").css("background-size","225px 39px");
  						$(".zanbtn").css("width","225px");
						$(".zanbtn .shangbtn").css("display","inline");
						$(".zanbtn .ping").css("width","75px");
						$(".zanbtn .zan").css("width","75px");
  						var bgurl = "/Static/mobile/css/article/images/qx.png";
  				}else if(status == 0){
  						//0未点赞,开启支付
  						$(".zanbtn").css("background-size","225px 39px");
  						$(".zanbtn").css("width","225px");
						$(".zanbtn .shangbtn").css("display","inline");
						$(".zanbtn .ping").css("width","75px");
						$(".zanbtn .zan").css("width","75px");
  						
  						var bgurl = "/Static/mobile/css/article/images/zan.png";
  				}else if(status == 2){
						// 2已经点赞,关闭支付
						$(".zanbtn").css("background-size","180px 39px");
						$(".zanbtn").css("width","180px");
						$(".zanbtn .shangbtn").css("display","none");
						$(".zanbtn .ping").css("width","90px");
						$(".zanbtn .zan").css("width","90px");
						var bgurl = "/Static/mobile/css/article/images/qx2.png";
				}else if(status == 3){
					 //3.未点赞,关闭支付
					 $(".zanbtn").css("background-size","180px 39px");
					 $(".zanbtn").css("width","180px");
					$(".zanbtn .shangbtn").css("display","none");
					$(".zanbtn .ping").css("width","90px");
					$(".zanbtn .zan").css("width","90px");
					 var bgurl = "/Static/mobile/css/article/images/zan2.png";
					 
				}

				//图层定位
				$(".zanbtn").css("background-image","url("+bgurl+")");
  				$(".zanbtn").css("top",top);
				
				//判断当前点击的是否是上次点击的那个按钮
				if(old_selectid != now_selectid){
					//上一次点击 和 这一次点击不是是同一个地方
					//隐藏所有的已经弹出的层
					$(".zanbtn").hide();
				}
				
				$(".zanbtn").animate( { width: 'toggle', opacity: 'toggle'}, 100 );

	   		});
	   		
	   		
	   		//点赞
	   		$(".zan").on('click', function(){
	   			//发送点赞
	   			$.ajax({
	   				url : "/mobile/article/prise/",
	   				type : "GET",
	   				dataType : 'json',
	   				success : function(data) {

	   					if(data.ret == 0){
	   						// 成功
	   						
	   					}else{
	   						// 失败
	   						
	   					}
	   				},
	   				beforeSend:function(){
						//先隐藏浮窗
	   					//收起点赞
	   					$(".zanbtn").animate( { width: 'toggle', opacity: 'toggle'}, 100 );
	   		       },
	   		       error: function() {
	   				   //todo
	   		       }
	   		       
	   			});
	   		});
	   		
	   		//评论
	   		$(".ping").on('click', function(){
	   			
	   			$(".zanbtn").animate( { width: 'toggle', opacity: 'toggle'}, 100 );
	   			pinglun();

	   		});
	   		
	   		//打赏
	   		$(".shangbtn").on('click', function(){
	   			$(".zanbtn").animate( { width: 'toggle', opacity: 'toggle'}, 100 );
	   			
	   			var article_id = 6,money=0.08,to_uid=3,
	   			headimgurl='http://wx.qlogo.cn/mmopen/PiajxSqBRaEKj2GK6ibskdtBib6MZpnJ3ibNsn7Uk7DTN43cNZ0MxyMxmKtdYUMUCj8z6Uzib6bnhECvCZzRWBAefMg/132',
	   			zanshang_desc="猴年吉祥",zanshang_btn2="打赏",zanshang_type=3;
	   			shang(article_id,money,to_uid,headimgurl,zanshang_desc,zanshang_btn2,zanshang_type);
	   		});
	   		
	        $("#text").focus(function(){
	       	 $("#text").css("top",13);
	       	});
	        
	        
	        //上传顶部图片
	   		$(".shareline-pic").on('click', function(){
	   			Shareline_select();
	   		});
	        
	      //购买输入信息
	        function pinglun(){

	    	  
var txt = '<textarea class="comment-input" placeholder="评论"></textarea>'+
'<a class="reward_access" href="javascript:shang();" style="color: #fff;">评论</a>';
	        	

	        	//信息框
	        	layer.open({
	        	    content: txt,
	        	    shadeClose: true,//点击遮罩不关闭对话框
	        	    style: 'color:#000;width:100%;max-width: 500px;',
	        	    yes: function(){
	        	        
	        	    }, no: function(){
	        	        
	        	    },cancel: function(){
	        	       
	        	    }, end: function(){
	        	    },success: function(elem){
	        	       //获取焦点
	        	    	$(".comment-input").focus();
	        	    }   
	        	});
	        	
	        	
	        
	        	
	        }
	   		
	   		
	   		
	   		
	   		
	   		
       });

       </script>


    <span class="zanbtn">
    	<span class="ping">
    		<span class="icons-ping"></span>
    		<span></span>
    	</span>
    	<span class="shangbtn">
    		<span></span>
    		<span></span>
    	</span>

    	<span  class="zan">
    		<span class="icons-zan"></span>
    		<span ></span>
    	</span>
    	
    </span>


    <header>
    	<span class="shareline-pic">
    		<img src="<?php echo C('UPYUN_DOMAIN');?>/<?php echo $memberinfo['shareline_pic'];?>!shareline" onerror="javascript:this.src='<?php echo C('UPYUN_DOMAIN');?>/youhong/article/shareline/shareline.jpg!shareline';" id="bg">
    	</span>
		<p class="data-name" id="user-name">小贝</p>
		<img src="http://wx.qlogo.cn/mmopen/PiajxSqBRaELN0w4wPXyb94ibUPChRVMyLmVZBzL5tmVYmpicNvWkAXdsDEZ4tTBiaobnr28fYhqTzBriaTTI75dGWQ/0" class="data-avt" id="avt">
    </header>

    <div id="main">
        <div id="list">
            <ul id="man" class="previewImageList">
                <li>
                    <div class="po-avt-wrap emptybtn">
                        <img src="http://wx.qlogo.cn/mmopen/PiajxSqBRaELN0w4wPXyb94ibUPChRVMyLmVZBzL5tmVYmpicNvWkAXdsDEZ4tTBiaobnr28fYhqTzBriaTTI75dGWQ/0" class="po-avt data-avt">
                    </div>
                    <div class="po-cmt">
	                    <div class="forbtn">
	                        <div class="po-hd emptybtn">

		                            <p class="po-name"><span class="data-name">小贝</span></p>
		                            <p class="post">谢谢圆圆给我一个难忘的圣诞！今天的巴黎，好美，爱你么么哒 @高圆圆</p>
		                            <img src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/1.jpg!headimgurl" data-src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/1.jpg" class="list-img preview">
		                            <img src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/2.jpg!headimgurl" data-src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/2.jpg" class="list-img preview">
		                            <img src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/3.jpg!headimgurl" data-src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/3.jpg" class="list-img preview">
		                            <img src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/4.jpg!headimgurl" data-src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/4.jpg" class="list-img preview">
		                            <img src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/5.jpg!headimgurl" data-src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/5.jpg" class="list-img preview">
		                            <p class="time">刚刚</p>

	                        </div>
	                            <span class="c-icon" selectid="1" status="1" diankai="0">
	                            	<img src="/Static/mobile/css/article/images/c.png" >
	                            </span>
	                     </div>
                        <div class="r"></div>
                        <div class="cmt-wrap emptybtn">

	                            <div class="like"><em class="icons">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</em><span class="data-name">小贝</span>，<span class="data-name">小贝</span>，杨幂，王凯，宁泽涛，钟汉良，王思聪，霍建华</div>
	                            <div class="cmt-list">
	                                <p><span>高圆圆</span>：和你在一起，我很开心。宝贝圣诞快乐</p>
	                                <p><span class="data-name">小贝</span>回复<span>高圆圆</span>：我也是~</p>
	                                <p><span>王思聪</span>：求赵又廷的心理阴影面积</p>
	                            </div>

                        </div>
                    </div>
                </li>
                <li>
                    <div class="po-avt-wrap">
                        <img src="http://wx.qlogo.cn/mmopen/PiajxSqBRaELN0w4wPXyb94ibUPChRVMyLmVZBzL5tmVYmpicNvWkAXdsDEZ4tTBiaobnr28fYhqTzBriaTTI75dGWQ/0" class="po-avt data-avt">
                    </div>
                    <div class="po-cmt">
                    	<div class="forbtn">
	                        <div class="po-hd emptybtn">

		                            <p class="po-name"><span class="data-name">小贝</span></p>
		                            <p class="post">除了有钱和英俊，我一无所有。不过没关系，因为我#主要看气质#
		                                <img  src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/21.jpg!h180" data-src="http://fxmall.b0.upaiyun.com/youhong/article/shareline/21.jpg"  class="data-avt preview">
		                            </p>
		                            <p class="time">1分钟前</p>

	                        </div>
	                        <span class="c-icon" selectid="2" status="3" diankai="0">
	                        	<img src="/Static/mobile/css/article/images/c.png">
	                        </span>
                        </div>
                        
                        <div class="r"></div>
                        <div class="cmt-wrap emptybtn">

	                            <div class="like"><em class="icons">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</em>林志玲，范冰冰，王凯，胡歌，霍建华，杨幂，赵丽颖</div>
	                            <div class="cmt-list">
	                                <p><span>林志玲</span>：你很有气质，这也是我选择你的原因</p>
	                                <p><span class="data-name">小贝</span>回复<span>林志玲</span>：么么哒</p>
	                            </div>

                        </div>
                    </div>
                </li>

                <li>
                    <div class="po-avt-wrap">
                        <img src="http://s.juancdn.com/jpwebapp/images/pengyouquan/wanghon/juanpi.png" class="po-avt">
                    </div>
                    <div class="po-cmt">
                    
                    	<div class="forbtn">
	                        <div class="po-hd emptybtn">
		                            <p class="ads">推广<img src="/Static/mobile/css/article/images/ads.png"></p>
		                            <p class="po-name">卷皮</p>
		                            <p class="post">万万没想到，今年圣诞居然准备了这么多惊喜。长按二维码立即查看</p>
		                            
		                                <img src="http://s.juancdn.com/jpwebapp/images/pengyouquan/christmas/slogan.jpg" class="list-img">
		                                <img src="http://s.juancdn.com/jpwebapp/images/pengyouquan/wanghon/juanpi-1.jpg" class="list-img">
		                            
		                            <p class="post" style="clear: both;float: left;">
		                                <a href="#" class="ad-link">查看详情 <img src="/Static/mobile/css/article/images/link.png"></a>
		                            </p>
		                            <p class="time">3小时前</p>
	                        </div>
                            <span class="c-icon" selectid="3" status="2" diankai="0">
                            	<img src="/Static/mobile/css/article/images/c.png">
                            </span>
                        </div>
                        
                        <div class="r"></div>
                        <div class="cmt-wrap emptybtn">
	                            <div class="like"><em class="icons">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</em><span class="data-name">小贝</span>，杨幂，王思聪，胡歌，霍建华，王凯，宁泽涛，杨洋，邓超</div>
	                            <div class="cmt-list">
	                                <p><span>林志玲</span>：<i class="data-name">小贝</i>，圣诞节送我的大衣就是在这买的吗？</p>
	                                <p><span class="data-name">小贝</span>回复<span>林志玲</span>：对呀，超赞的！</p>
	                            </div>
                        </div>
                    </div>
                </li>

            </ul>

        </div>

<link rel="stylesheet" href="__STATIC__mobile/css/article/article.css" type="text/css"/>
{:W('Guest/shang')}

        
        <!-- 
        <div id="share" class="_show">
            <a href="http://m.juanpi.com/event/pengyouquan">生成朋友圈</a><a id="share_add">惊呆小伙伴</a>
            <p>（此朋友圈纯属虚构）</p>
        </div>
        <div class="hide" id="guide"></div>
         -->
    </div>

<script type="text/javascript" src="__STATIC__mobile/css/article/article.js"></script>
</body>
</html>
 